import React, { Component } from 'react';
import { withRouter } from 'react-router-dom';
import '../css/header.css';
import MemoryUtils from '../utils/MemoryUtils';
import menuList from './MenuConfig';
import { Modal } from 'antd';
import LinkButton from './LinkButton';
import StorageUtils from '../utils/StorageUtils';

class Header extends Component {
    state = {
        currentTime: ''
    }
    logout = () => {
        Modal.confirm({
            title: '确认退出吗？',
            onOk: () => {
                StorageUtils.removeUser();
                MemoryUtils.user = {};
                this.props.history.replace('/login');
            },
            onCancel() {
            },
        })
    }

    getTitle = () => {
        let title = '';
        const path = this.props.location.pathname;
        menuList.forEach(item => {
            if (path.indexOf(item.key)===0) {
                title = item.title
            } else if (item.children) {
                const cItem = item.children.find(cItem => path.indexOf(cItem.key)===0);
                if (cItem) {
                    title = cItem.title;
                }
            }
        })
        return title;
    }

    componentDidMount() {
        function Today(time,date1) {
            let year = date1.getFullYear();
            let month = date1.getMonth();
            month = month + 1;
            let currentDay = date1.getDate();
            let day = date1.getDay();
            let weeks = ["星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六",];
            let hour = date1.getHours();
            let min = date1.getMinutes();
            let second = date1.getSeconds();
            hour = convertTimer(hour);
            min = convertTimer(min);
            second = convertTimer(second);
            time = year + "-" + month + "-" + currentDay + "  " + weeks[day] +  ' ' + hour + ":" + min + ":" + second;
            return time;
        }
        function convertTimer(start) {
            return start < 10 ? ("0" + start) : start;
        }
        setInterval(() => {
            let date1 = new Date()
            let time = Today(this.state,date1)
            this.setState({
                currentTime: time
            })
        }, 1000)
    }

    componentWillUnmount() {
        clearInterval(this.intervalId);
    }

    render() {
        const title = this.getTitle();
        const { currentTime } = this.state;
        const user = MemoryUtils.user;
        return (
            <div className='head'>
                <div className='head-top'>
                    <LinkButton onClick={this.logout}>退出</LinkButton>
                    <span>欢迎，{user}</span>
                </div>
                <div className='head-bottom'>
                    <div className='head-bottom-left'>
                        <span>{title}</span>
                    </div>
                    <div className='head-bottom-right'>
                        <span>{currentTime}</span>
                    </div>
                </div>
            </div>
        )
    }
}

export default withRouter(Header)
